<!-- app/templates/register.html -->
{% extends "base.html" %}
{% block content %}
<div class="d-flex justify-content-center">
    <div class="card card-pretty w-100" style="max-width:560px;">
        <div class="card-body">
            <h4 class="card-title mb-3">注册新用户</h4>
            <form method="post">
                <div class="mb-3">
                    <input class="form-control" type="text" name="username" placeholder="用户名" required value="{{ default_username or '' }}">
                </div>
                <div class="mb-3">
                    <input class="form-control" type="password" name="password" placeholder="密码" required>
                </div>
                <div class="form-check mb-3">
                    <input class="form-check-input" type="checkbox" id="isAdmin" name="is_admin">
                    <label class="form-check-label" for="isAdmin">管理员权限（仅限负责人）</label>
                </div>
                <div class="mb-3" id="invite-row" style="display:none;">
                    <label class="form-label">管理员邀请码</label>
                    <input class="form-control" type="text" name="admin_invite_code" id="adminInvite" placeholder="填写管理员邀请码以创建管理员账号">
                    <div class="form-text">如需创建管理员，请输入有效的邀请码（管理员可在系统设置中配置）。</div>
                </div>
                <div class="d-flex justify-content-between align-items-center">
                    <button class="btn btn-success" type="submit">注册</button>
                    <a href="/login">已有账号？去登录</a>
                </div>
            </form>
        </div>
    </div>
</div>
<script>
    (function(){
        const adminCheckbox = document.getElementById('isAdmin');
        const inviteRow = document.getElementById('invite-row');
        function setInviteVisible(){ inviteRow.style.display = adminCheckbox.checked ? 'block' : 'none'; }
        document.addEventListener('DOMContentLoaded', setInviteVisible);
        adminCheckbox.addEventListener('change', setInviteVisible);
    })();
</script>
<script>
    document.getElementById('isAdmin').addEventListener('change', function(e){
        const b = document.getElementById('invite-block');
        b.style.display = e.target.checked ? 'block' : 'none';
    });
</script>
{% endblock %}
